<template>
    <div hidden sm-block>
        <n-dropdown :options="options" @select="handleSelect">
            <div flex items-center cursor-pointer>
                <img v-if="account.avatar" :src="account.avatar" mr10 w-35 h-35 rounded-full />
                <icon-custom-logo v-else mr10 w-35 h-35 rounded-full />
                <!-- <span>{{ account.name }}</span> -->
            </div>
        </n-dropdown>
    </div>
</template>
  
<script setup>
import { useAccountStore } from "@/stores/account";
import { renderIcon } from "@/utils/icon";

const account = useAccountStore();

const options = [
    {
        label: "退出登录",
        key: "logout",
        icon: renderIcon("mdi:exit-to-app", { size: "14px" }),
    },
];

function handleSelect(key) {
    if (key === "logout") {
        $dialog.confirm({
            title: "提示",
            type: "info",
            content: "确认退出？",
            confirm() {
                account.logout();
                $message.success("已退出登录");
            },
        });
    }
}
</script>